<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<ui:composition template="../template/layout.xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets">
	<ui:param name="pageHeaderTitle" value="Find client" />
	<ui:param name="pageTitle" value="Find client" />
	<ui:define name="content">
		<div id="inner_content">
		<h:form>
			<h:panelGrid columns="2" cellpadding="8" style="width: 595px">			
				<h:panelGroup>
					<p:outputLabel value="Client name: " for="searchString" />
					<br />					
					<p:inputText id="searchString" title="searchString" value="#{findClientBean.searchString}" style="width: 250px" maxlength="30"/>						
				</h:panelGroup>
				<h:panelGroup>
					<br />
					<p:message id="searchStringMsg" for="searchString" />
				</h:panelGroup>				
					<p:commandButton value="Search" styleClass="pCommandButton" process="@this searchString" update=":resultGroup searchStringMsg" actionListener="#{findClientBean.findClient}"/>													
			</h:panelGrid>					
		</h:form>
			<br />			
			<br />
			<h:panelGroup id="resultGroup">
				<p:dataTable id="findClientResultTable" var="client" value="#{findClientBean.resultList}" paginator="true" rows="10"  lazy="true" paginatorAlwaysVisible="false" rendered="#{findClientBean.render}"
		                paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}" paginatorPosition="bottom" pageLinks="5" selectionMode="single" rowKey="#{client.id}">
		            <p:ajax event="rowSelect" listener="#{findClientBean.onRowSelect}" />
					<p:column headerText="Results">
						<h:outputText value="#{client.firstName} #{client.lastName}" />
					</p:column>
				</p:dataTable>
			</h:panelGroup>
			<br />
			<h:form>
				<h:commandLink action="#{findClientBean.populateWithTestData()}" value="Populate table" style="padding-left: 10px" rendered="false"/>
			</h:form>		
			<br /> <br />
		<div style="width: 320px; margin: 0 auto">
			<p:messages />
		</div>	
		</div>		
	</ui:define>
</ui:composition>
</html>